<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript" src="day03_jQuery/script/jquery-1.7.2.min.js"></script>
    <script type="text/javascript">
        $(function () {
            //全选按钮
            $("#selectAll").click(function () {
                $(".names").prop("checked", true);
            });
           //全不选
            $("#selectNotALL").click(function () {
                $(".names").attr("checked", false);
            });
            //反选
            $("#selectF").click(function(){
                $(".names").map(function () {
                    if(this.checked){
                        this.checked = false;
                    }else {
                        this.checked = true;
                    };
                });
            });
            //复选框
            $("#selectAllAndNot").click(function () {
                $(".names").prop("checked",$("#selectAllAndNot").prop("checked"));
            });
            $(".names").click(function () {
               if ($(".names").length == $(".names:checked").length){
                   $("#selectAllAndNot").prop("checked",true);
               } else {
                   $("#selectAllAndNot").prop("checked",false);

               }
            });
        });
    </script>
</head>
<body>
<input type="button" id="selectAll" value="全  选">
<input type="button" id="selectNotALL" value="全不选">
<input type="button" id="selectF" value="反  选">
<input type="checkbox" id="selectAllAndNot">全选/全不选<br>

你喜欢什么样的球类运动？<br>
<input type="checkbox" class="names" value="篮球">篮球<br>
<input type="checkbox" class="names" value="足球">足球<br>
<input type="checkbox"  class="names" value="排球">排球<br>
<input type="checkbox"  class="names" value="羽毛球">羽毛球<br>
<input type="checkbox"  class="names" value="橄榄球">橄榄球<br>
<input type="checkbox"  class="names" value="棒球">棒球<br>

</body>
</html>